import React,{useState} from 'react';
import styles from "./index.scss";

interface routerItem {
  path:string,
  name:string,
  icon:string
}

interface defaultTypes {
  routerList:routerItem[],
  history:any, // 路由跳转对象
  pathname:string // 路径名称
}


/**
 * 
 * const routerList = [
    {path:'/',name:'自动化p盘',icon:'icon-codepen'},
    {path:'/hd_list',name:'硬件状态',icon:'icon-desktop'},
    {path:'/update_key',name:'切换公钥',icon:'icon-lock'}
  ]
 * 
 */

const LeftSider = (props:defaultTypes) => {
  const { routerList,history,pathname } = props;
  return (

    <div className={styles.leftSider}>
      {
        routerList.map((val,index)=>{
          return (
             <div key={index} className={`${styles.lines} ${pathname==val.path?styles.current:''}`} onClick={()=>{
               history.push(val.path)
              }}><span className={"iconfont "+val.icon }></span><p>{val.name}</p> </div>
          )
        })
      }
    </div>
    
  );
}

export default LeftSider;
